<template>
  <div class="header">
    <div class="header-left">
      <div class="iconfont back-icon">&#xe624;</div>
    </div>
    <div class="header-input">
      <span class="iconfont">&#xe632;</span>
      输入城市/景点/游玩主题
    </div>
    <router-link to='/city'>
      <div class="header-right">
       城市
        <span class="iconfont arrow-icon">&#xe662;</span>
      </div>
    </router-link>
  </div>
</template>

<script>
export default {
  name: 'HomeHead',
  props:{
  	city:String
  }
}
</script>

<style lang="stylus" scoped>
@import '~styles/varibles.styl';
 .header
 	display: flex;
 	line-height: .86rem;
 	background: $bgColor;
 	color: #fff;
 
 .header-left
 	width: .64rem;
 	float: left;

 .header-input
 	flex: 1;
 	height: .64rem;
 	line-height: .64rem;
 	margin-top: .12rem;
 	margin-left: .2rem;
 	padding-left: .2rem;
 	background: #fff;
 	border-radius: .1rem;
 	color: #ccc;
 
 .header-right
 	width: 1.24rem;
 	float: right;
 	text-align: center;
 
 	

</style>